<template>
    <div>
        <!-- 动态class: -->
        <!-- 原理就是利用 v-bind动态绑定 class属性 -->
        <!-- :class="{类名1:布尔值,类名2:布尔值}" -->
        <p :class="{red:bool}">我是一个可爱的p</p>
    </div>
</template>

<script>
export default {
    name: 'Two3Class',

    data() {
        return {
            bool:true
        };
    },
}
</script>

<style lang="scss" scoped>
    .red{
        color: red;
    }
</style>